<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <!-- import CSS -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!--    <link rel="stylesheet" href="css/viewStudent.css">-->
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <!-- import Vue before Element -->
    <script src="https://unpkg.com/vue@2/dist/vue.js"></script>
    <!-- 引入http-vue-loader -->
    <script src="https://unpkg.com/http-vue-loader"></script>
    <!-- import JavaScript -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<body>
<div id="app">
    <el-row :gutter="20">
        <el-col :span="6">
        <el-upload
                class="upload-demo"
                action="answer/result"
                multiple
                :on-change="onchange"
                :on-success="success"
                :file-list="fileList">
            <el-button size="small" type="primary">点击上传整卷预览.HTML</el-button>
            <div slot="tip" class="el-upload__tip">将整卷预览.HTML文件上传获取答案</div>
        </el-upload>
        </el-col>
        <el-col :span="6">
        <el-button size="small" type="primary" onclick="window.location.href='pages.html'">查看详情</el-button>
        </el-col>
    </el-row>
    <div class="box" style="display: flex;flex-wrap: wrap">
        <div style=" border-style:solid;border-width:2px;margin: 5px" v-for="(item,index) in listDate" :key="index">
            {{item.title + item.answer}}
        </div>
    </div>
</div>
</body>
<script>
    Vue.use(httpVueLoader)
    new Vue({
        el: '#app',
        components: {
            'bb': httpVueLoader("bb.vue")
        },
        data() {
            return {
                listDate: [],
                fileList: []
            }
        },
        methods: {
            aa(){
                window.location.href='pages.html'
            },
            onchange(file, fileList) {
                fileList = []
                this.fileList = []
                this.fileList.push(file)
            },
            success(res) {
                this.tableData = res
                this.listDate = res
                this.fileList = []

            }
        }
    })
</script>

<style>
    .box div {
        margin: 5px;
        min-width: 80px;
        min-height: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
</style>
</html>



